import QtQuick 1.0
import "common"
Item {
    id:root
    width: 360
    height: 180
    y:640
    property bool show : false
    property alias repeater : repeater
    signal clicked(int index)

    function showBar(){show = true;}
    function hideBar(){show = false;}


    onShowChanged: {
        y = show ? 640 - root.height : 640

    }
    Behavior on y {
        NumberAnimation {
            easing.type: Easing.InOutQuart
            duration : 500

        }
    }






    Grid {
        anchors.bottom: parent.bottom
        columns: 4
        rows: 2

        Repeater {
            id:repeater
            model:model
            Item {
                width: 90
                height: 90
                Rectangle {
                   anchors.fill: parent
                   color: area.pressed ? "darkgray" : "black"
                   opacity: 0.8

                }

                Image {
                    anchors.centerIn: parent
                    anchors.verticalCenterOffset: -5
                    source: "gfx/"+repeater.model.get(index).icon
                }


                    Text {
                        anchors.bottom: parent.bottom
                        anchors.bottomMargin: 5
                        anchors.horizontalCenter: parent.horizontalCenter

                        text:repeater.model.get(index).title
                        font.family: "UbuntuBeta"
                        color:"white"
                        font.pixelSize: 12
                    }
                    MouseArea {
                        id:area
                        anchors.fill: parent
                        onClicked: root.clicked(index)
                    }
                }


            }

        }



    }


